<template>
<view class="container">
	    <view class="header">
	        <view class="back" @click="changePop">
	            <svg t="1671784173054" class="icon" viewBox="0 0 1024 1024" version="1.1"
	                xmlns="http://www.w3.org/2000/svg" p-id="2679" width="20" height="20">
	                <path d="M532.526499 904.817574L139.506311 511.797385 532.526499 118.777197c12.258185-12.258185 12.432147-32.892131-0.187265-45.51052-12.707416-12.707416-32.995485-12.703323-45.511543-0.187265L75.166957 484.739123c-7.120165 7.120165-10.163477 17.065677-8.990768 26.624381-1.500167 9.755178 1.5104 20.010753 8.990768 27.491121l411.660734 411.660734c12.258185 12.258185 32.892131 12.432147 45.511543-0.187265 12.707416-12.707416 12.7023-32.995485 0.187265-45.51052z"
	                    p-id="2680" fill="#ffffff"></path>
	            </svg>
	        </view>
	        <view class="fun">
	            <svg t="1671784328380" class="icon" viewBox="0 0 1024 1024" version="1.1"
	                xmlns="http://www.w3.org/2000/svg" p-id="3795" width="20" height="20">
	                <path d="M269.44 256l23.296-75.381333A74.666667 74.666667 0 0 1 364.074667 128h295.850666a74.666667 74.666667 0 0 1 71.338667 52.618667L754.56 256H821.333333c64.8 0 117.333333 52.533333 117.333334 117.333333v426.666667c0 64.8-52.533333 117.333333-117.333334 117.333333H202.666667c-64.8 0-117.333333-52.533333-117.333334-117.333333V373.333333c0-64.8 52.533333-117.333333 117.333334-117.333333h66.773333z m23.605333 64H202.666667a53.333333 53.333333 0 0 0-53.333334 53.333333v426.666667a53.333333 53.333333 0 0 0 53.333334 53.333333h618.666666a53.333333 53.333333 0 0 0 53.333334-53.333333V373.333333a53.333333 53.333333 0 0 0-53.333334-53.333333h-90.378666a32 32 0 0 1-30.570667-22.549333l-30.272-97.930667a10.666667 10.666667 0 0 0-10.186667-7.52H364.074667a10.666667 10.666667 0 0 0-10.186667 7.52l-30.272 97.92A32 32 0 0 1 293.045333 320zM512 725.333333c-88.362667 0-160-71.637333-160-160 0-88.362667 71.637333-160 160-160 88.362667 0 160 71.637333 160 160 0 88.362667-71.637333 160-160 160z m0-64a96 96 0 1 0 0-192 96 96 0 0 0 0 192z"
	                    fill="#ffffff" p-id="3796"></path>
	            </svg>
	            <svg t="1671784353100" class="icon" viewBox="0 0 1024 1024" version="1.1"
	                xmlns="http://www.w3.org/2000/svg" p-id="4929" width="20" height="20">
	                <path d="M469.333333 768c-166.4 0-298.666667-132.266667-298.666666-298.666667s132.266667-298.666667 298.666666-298.666666 298.666667 132.266667 298.666667 298.666666-132.266667 298.666667-298.666667 298.666667z m0-85.333333c119.466667 0 213.333333-93.866667 213.333334-213.333334s-93.866667-213.333333-213.333334-213.333333-213.333333 93.866667-213.333333 213.333333 93.866667 213.333333 213.333333 213.333334z m251.733334 0l119.466666 119.466666-59.733333 59.733334-119.466667-119.466667 59.733334-59.733333z"
	                    fill="#ffffff" p-id="4930"></path>
	            </svg>
	        </view>
	    </view>
		 <swiper :vertical="true" class="swiper">
		        <swiper-item class="swiperItem">
		            <video :enable-progress-gesture="false" objectFit="cover" class="video" :show-progress="false"
		                :show-play-btn="false" mobilenet-hint-type="1" play-btn-position="center" :autoplay="true"
		                src="https://douyin-fbk.oss-cn-hangzhou.aliyuncs.com/VCG42N1422310449.mp4"></video>
		        </swiper-item>
		        <swiper-item class="swiperItem">
		            <video :enable-progress-gesture="false" objectFit="cover" class="video" :show-progress="false"
		                :show-play-btn="false" mobilenet-hint-type="1" play-btn-position="center" :autoplay="true"
		                src="https://douyin-fbk.oss-cn-hangzhou.aliyuncs.com/VCG42N1423632906.mp4"></video>
		        </swiper-item>
		        <swiper-item class="swiperItem">
		            <video :enable-progress-gesture="false" objectFit="cover" class="video" :show-progress="false"
		                :show-play-btn="false" mobilenet-hint-type="1" play-btn-position="center" :autoplay="true"
		                src="https://douyin-fbk.oss-cn-hangzhou.aliyuncs.com/VCG42N1428630188.mp4"></video>
		        </swiper-item>
		        <swiper-item class="swiperItem">3</swiper-item>
		    </swiper>
			    <view class="comment">
			        <view class="first">
			            <input type="text" placeholder="平等表达,友善交流" />
			        </view>
			        <view class="last">
			            <svg t="1671788098836" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="12567" width="20" height="20"><path d="M910.933333 689.066667c-51.2 83.2-123.733333 134.4-211.2 166.4-66.133333 25.6-138.666667 34.133333-209.066666 29.866666-72.533333-4.266667-147.2-23.466667-211.2-64s-110.933333-100.266667-136.533334-170.666666c-21.333333-74.666667-19.2-155.733333 0-228.266667 21.333333-70.4 59.733333-134.4 110.933334-185.6 59.733333-57.6 132.266667-93.866667 211.2-108.8 68.266667-12.8 140.8-10.666667 206.933333 6.4 57.6 14.933333 104.533333 40.533333 142.933333 85.333333 36.266667 40.533333 61.866667 89.6 68.266667 145.066667 6.4 57.6-4.266667 117.333333-29.866667 170.666667-34.133333 70.4-98.133333 136.533333-174.933333 172.8-10.666667 4.266667-23.466667 6.4-32 2.133333-4.266667-4.266667-8.533333-10.666667-6.4-21.333333 19.2-142.933333 61.866667-260.266667 113.066667-401.066667 4.266667-10.666667-6.4-32-27.733334-38.4-21.333333-8.533333-36.266667 4.266667-38.4 8.533333-2.133333 8.533333-19.2 51.2-25.6 74.666667-12.8-32-38.4-61.866667-68.266666-78.933333-34.133333-19.2-74.666667-23.466667-113.066667-14.933334-42.666667 8.533333-81.066667 29.866667-110.933333 59.733334-70.4 72.533333-117.333333 168.533333-113.066667 268.8 2.133333 59.733333 21.333333 117.333333 66.133333 157.866666 38.4 36.266667 87.466667 46.933333 138.666667 34.133334 46.933333-12.8 85.333333-40.533333 117.333333-76.8v34.133333c0 21.333333 8.533333 40.533333 25.6 55.466667 14.933333 12.8 36.266667 17.066667 66.133334 10.666666 102.4-25.6 204.8-128 253.866666-226.133333 27.733333-57.6 36.266667-125.866667 29.866667-187.733333-6.4-61.866667-27.733333-119.466667-66.133333-170.666667-46.933333-64-106.666667-100.266667-183.466667-121.6-78.933333-21.333333-160-25.6-243.2-10.666667-98.133333 17.066667-185.6 64-253.866667 134.4C149.333333 258.133333 106.666667 330.666667 85.333333 409.6c-25.6 87.466667-25.6 183.466667 8.533334 270.933333 29.866667 74.666667 81.066667 142.933333 149.333333 189.866667 72.533333 49.066667 162.133333 70.4 249.6 76.8 89.6 6.4 181.333333-6.4 264.533333-40.533333 70.4-29.866667 134.4-74.666667 187.733334-142.933334 8.533333-12.8 23.466667-40.533333 19.2-55.466666-12.8-34.133333-44.8-32-53.333334-19.2zM618.666667 456.533333c-10.666667 68.266667-44.8 140.8-93.866667 183.466667-23.466667 23.466667-49.066667 38.4-72.533333 46.933333-27.733333 8.533333-55.466667 6.4-76.8-6.4s-38.4-38.4-49.066667-78.933333c-17.066667-70.4 6.4-151.466667 42.666667-209.066667 25.6-38.4 64-74.666667 108.8-89.6 46.933333-14.933333 93.866667-2.133333 123.733333 36.266667 21.333333 32 23.466667 81.066667 17.066667 117.333333z" fill="#cdcdcd" p-id="12568"></path></svg>
			            <svg t="1671788128054" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13656" width="20" height="20"><path d="M872.802928 755.99406 872.864326 755.99406 872.864326 755.624646Z" fill="#cdcdcd" p-id="13657"></path><path d="M807.273469 216.727043c-162.808016-162.836669-427.736874-162.836669-590.544891 0-162.836669 162.806993-162.836669 427.736874 0 590.543867 162.808016 162.837692 427.737898 162.837692 590.544891 0C970.110137 644.462894 970.110137 379.534036 807.273469 216.727043M764.893242 764.92036c-139.444912 139.443889-366.370225 139.414213-505.798764 0-139.459239-139.473565-139.459239-366.354875 0-505.827417 139.428539-139.429563 366.354875-139.460262 505.798764 0C904.336108 398.521482 904.336108 625.476471 764.893242 764.92036" fill="#cdcdcd" p-id="13658"></path><path d="M381.724423 468.02137c24.783453 0 44.953841-20.169365 44.953841-44.967144 0-24.828478-20.170388-45.027519-44.953841-45.027519-24.842805 0-45.013193 20.199041-45.013193 45.027519C336.71123 447.852004 356.881618 468.02137 381.724423 468.02137" fill="#cdcdcd" p-id="13659"></path><path d="M640.680243 468.095048c24.812105 0 45.010123-20.213367 45.010123-45.01217 0-24.827455-20.198018-44.99682-45.010123-44.99682-24.785499 0-44.953841 20.169365-44.953841 44.99682C595.726401 447.88168 615.894743 468.095048 640.680243 468.095048" fill="#cdcdcd" p-id="13660"></path><path d="M642.245901 619.058294l-2.453888 0.798179c-40.310078 18.248619-83.548858 27.5341-128.411625 27.5341-46.343491 0-90.173742-9.375531-130.305765-27.799136l-2.425236-0.741897c-1.508353-0.413416-3.548826-1.003863-6.092765-1.003863-14.757099 0-26.734898 11.977799-26.734898 26.675546 0 6.978948 3.282766 13.988596 8.695033 19.253506l-0.325411 1.62501 6.831592 3.076058c47.911196 21.679765 100.021018 33.095769 150.681838 33.095769 51.608402 0 102.180194-11.120268 150.978597-33.361829 8.575306-4.703115 13.928221-13.721513 13.928221-23.511483C676.611593 627.458615 661.027663 613.290941 642.245901 619.058294" fill="#cdcdcd" p-id="13661"></path></svg>
			            <svg t="1671788145719" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="14655" width="20" height="20"><path d="M512 992C246.912 992 32 777.088 32 512 32 246.912 246.912 32 512 32c265.088 0 480 214.912 480 480 0 265.088-214.912 480-480 480z m0-64c229.76 0 416-186.24 416-416S741.76 96 512 96 96 282.24 96 512s186.24 416 416 416z" fill="#cdcdcd" p-id="14656"></path><path d="M256 544a32 32 0 0 1 0-64h512a32 32 0 0 1 0 64H256z" fill="#cdcdcd" p-id="14657"></path><path d="M480 256a32 32 0 0 1 64 0v512a32 32 0 0 1-64 0V256z" fill="#cdcdcd" p-id="14658"></path></svg>
			        </view>
			        </view>
</view>
<ListOperator></ListOperator>
</template>

<script setup>

	import ListOperator from './ListOpreator.vue'
	components: {
		ListOperator
	}
	const emits=defineEmits(['changePop'])
	const changePop=()=>{
		emits('changePop','change')
	}
</script>

<style scoped lang="scss">
	* {
		padding: 0px;
		margin: 0px;
	}

	.container {
		background-color: black;
		width: 100%;
		height: 100vh;
		background-color: black;
	}

	.header {
		width: 100%;
		height: 30px;
		position: fixed;
		right: 0px;
		top: 0px;
		left: 0px;
		z-index: 1000;

		.back {
			width: 30px;
			height: 30px;
			float: left;
			display: flex;
			justify-content: center;
			align-items: center;
		}

		.fun {
			width: 60px;
			height: 30px;
			display: flex;
			float: right;
			align-items: center;
			justify-content: space-around;
		}
	}

	.swiper {
		width: 100%;
		height: 94%;
	}

	.swiperItem {}

	.video {
		width: 100%;
		height: 100%;
	}

	.comment {
		width: 100%;
		height: 50px;
		display: flex;
		justify-content: space-around;
		align-items: center;
		.first{
			width: 60%;
			height: 30px;
		}
		.last{
			width: 40%;
			float: right;
			justify-content: space-around;
		}
	}
</style>
